/**
* Demo ATA章节号
*/
<template>
    <vp-dialog :span="1" ref="dialogRef">
        <template #title>
            <vp-label zh="Demo" en="Demo" align="left" />
        </template>

        <el-row :gutter="10">
            <el-col :span="2">
                <vp-label zh="下拉选择" en="" align="right" />
            </el-col>
            <el-col :span="4">
                <BasedataAtaSelect v-model="selectId"></BasedataAtaSelect>
            </el-col>
            <el-col :span="4">
                <vp-label zh="已选" en="" align="left" />
                {{ selectId }}
            </el-col>
        </el-row>
        <el-row style="margin-top: 20px;">
            <el-col :span="4">
                <vp-label zh="详细信息" en="" align="right" />
            </el-col>
            <el-col :span="4">
                <BasedataAtaLink :selectId="selectId" />
            </el-col>
        </el-row>

    </vp-dialog>
</template>

<script setup lang="ts" name="DemoAta">
import { defineAsyncComponent, defineExpose, ref } from 'vue'

import BasedataAtaSelect from '/@/components/vp/basedataAta/basedataAtaSelect.vue';
import BasedataAtaLink from '/@/components/vp/basedataAta/basedataAtaLink.vue';

const dialogRef = ref();

const selectId = ref('');

const handleOpen = () => {
    dialogRef.value.handleOpen();
}

defineExpose({
    handleOpen
})
</script>
<style scoped lang="scss"></style>
